<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>应用jQuery的index和find等方法实现横向选项卡</title>
<!-- 网站样式表-->
<link rel="stylesheet" href="css/index.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/global.css" type="text/css" media="screen" />
<!-- 网站样式表 END-->
<script src="js/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
	tab();
});

function tab(){
  var _obj = $("#buyact").find(".tab0>li");
  //单击
  $(_obj).click(function(){
	  var _ID = $(_obj).index(this);
	  $(_obj).removeClass();				   
	  $(this).addClass("index");
	  $("#buyact").find(".tbody>div").removeClass().addClass("none");
	  $("#buyact").find(".tbody>div:eq("+ _ID +")").removeClass().addClass("block");
  });
}
</script>

</head>
<body>
<div id="buyact" class="row790">
  <div class="thead">
    <h2>促销在进行...</h2>
    <ul class="tab0">
     <li class="index"><em>特价宝贝</em></li>
     <li><em>新品上架</em></li>
     <li><em>今日必买</em></li>
     <li><em>创意极品</em></li>
    </ul>
  </div>
  <div class="tbody">
   <div class="block">
      <div class="tInfo"><i class="iPic"><a href="ProductDetail-192-5-14-57.html" target="_blank"><img src="userFiles/20100422135446.jpg" alt="" width="175" height="85" /></a></i><i class="iTitle"><a href="ProductDetail-192-5-14-57.html" target="_blank">希捷单碟500G</a></i><ul><li><a href="ProductDetail-192-5-14-57.html" target="_blank"><p>希捷12代硬盘，单碟500G设计/性能大幅提升/三年保固…</p></a></li></ul>
      </div>
      <div class="tInfo"><i class="iPic"><a href="ProductDetail-71-2-5-20.html" target="_blank"><img src="userFiles/20100422140643.gif" alt="" width="175" height="85" /></a></i><i class="iTitle"><a href="ProductDetail-71-2-5-20.html" target="_blank">台电X19+ 4G超长70小…</a></i><ul><li><a href="ProductDetail-71-2-5-20.html" target="_blank"><p>全新语音智能导航科技，TTS文本阅读，70小时超长巡航…</p></a></li></ul>
      </div>
      <div class="tInfo"><i class="iPic"><a href="ProductDetail-581-1-3-11.html" target="_blank"><img src="userFiles/20100129105917.jpg" alt="" width="175" height="85" /></a></i><i class="iTitle"><a href="ProductDetail-581-1-3-11.html" target="_blank">金圣斯 笔记本支架包…</a></i><ul><li><a href="ProductDetail-581-1-3-11.html" target="_blank">可收缩支架/操作更加方便和轻松/利于电脑热量的散发</a></li></ul>
      </div>
      <div class="tInfo"><i class="iPic"><a href="ProductDetail-1076-1-2-5.html" target="_blank"><img src="userFiles/20100306122040.jpg" alt="" width="175" height="85" /></a></i><i class="iTitle"><a href="ProductDetail-1076-1-2-5.html" target="_blank">酷奇Nl013 保护膜</a></i><ul><li><a href="ProductDetail-1076-1-2-5.html" target="_blank">远离“咸猪手”，联想小y键盘保护神</a></li></ul>
      </div>
   </div>
   <div class="none">
     <div class="tInfo"><i class="iPic"><a href="subject/subject20100121/index.html" target="_blank"><img src="userFiles/20100127112745.jpg" alt="" width="175" height="85" /></a></i><i class="iTitle"><a href="subject/subject20100121/index.html" target="_blank">圣奇仕电池特价场</a></i><ul><li><a href="subject/subject20100121/index.html" target="_blank">圣奇仕新春好礼促销专场，零利润回馈广大客户</a></li></ul></div>
     <div class="tInfo"><i class="iPic"><a href="ProductDetail-1924-1-1-2.html" target="_blank"><img src="userFiles/20100127145321.jpg" alt="" width="175" height="85" /></a></i><i class="iTitle"><a href="ProductDetail-1924-1-1-2.html" target="_blank">联想 S10-3t(奇幻星空…</a></i><ul><li><a href="ProductDetail-1924-1-1-2.html" target="_blank">联想超便携笔记本，支持多点触摸的旋转平板上网本</a></li></ul></div>
     <div class="tInfo"><i class="iPic"><a href="ProductDetail-2091-2-5-20.html" target="_blank"><img src="userFiles/20100127150826.jpg" alt="" width="175" height="85" /></a></i><i class="iTitle"><a href="ProductDetail-2091-2-5-20.html" target="_blank">台电 T51(8G)</a></i><ul><li><a href="ProductDetail-2091-2-5-20.html" target="_blank">巅峰音质!!! 革命性五核HIFI MP4，支持720P全格式高清视…</a></li></ul></div>
     <div class="tInfo"><i class="iPic"><a href="ProductDetail-2309-4-12-103.html" target="_blank"><img src="userFiles/20100127145630.jpg" alt="" width="175" height="85" /></a></i><i class="iTitle"><a href="ProductDetail-2309-4-12-103.html" target="_blank">诺基亚X6-00</a></i><ul><li><a href="ProductDetail-2309-4-12-103.html" target="_blank">诺基亚 X6-00 玩乐天王版震撼上市，全城热销抢购中</a></li></ul></div>
   </div>
   <div class="none">
     <div class="tInfo"><i class="iPic"><a href="ProductDetail-995-2-7-25.html" target="_blank"><img src="userFiles/20100414163952.jpg" alt="" width="175" height="85" /></a></i><i class="iTitle"><a href="ProductDetail-995-2-7-25.html" target="_blank">最低价 金士顿2G TF卡…</a></i><ul><li><a href="ProductDetail-995-2-7-25.html" target="_blank"><p>便宜爽到心跳！金士顿（Kingston）4G TF(MicroSD)卡…</p></a></li></ul></div>
     <div class="tInfo"><i class="iPic"><a href="ProductDetail-3442-5-14-54.html" target="_blank"><img src="userFiles/20100422104716.jpg" alt="" width="175" height="85" /></a></i><i class="iTitle"><a href="ProductDetail-3442-5-14-54.html" target="_blank">平民四核 AMD X4 630…</a></i><ul><li><a href="ProductDetail-3442-5-14-54.html" target="_blank"><p>速龙II四核630处理器相比原来的620不仅在主频方面进…</p></a></li></ul></div>
     <div class="tInfo"><i class="iPic"><a href="ProductDetail-514-6-17-72.html" target="_blank"><img src="userFiles/20100406172741.jpg" alt="" width="175" height="85" /></a></i><i class="iTitle"><a href="ProductDetail-514-6-17-72.html" target="_blank">惠普（HP） officeje…</a></i><ul><li><a href="ProductDetail-514-6-17-72.html" target="_blank"><p>惠普（HP） officejet J4580 一体机简单易用，价格经…</p></a></li></ul></div>
     <div class="tInfo"><i class="iPic"><a href="../itgonow.com/ProductDetail-1561-1-2-8.html" target="_blank"><img src="userFiles/20100406171657.jpg" alt="" width="175" height="85" /></a></i><i class="iTitle"><a href="../itgonow.com/ProductDetail-1561-1-2-8.html" target="_blank">亮洁清洁湿巾 88片装…</a></i><ul><li><a href="../itgonow.com/ProductDetail-1561-1-2-8.html" target="_blank"><p>亮洁清洁湿巾 现代办公必备理想用品</p></a></li></ul></div>
  </div>
   <div class="none">
     <div class="tInfo"><i class="iPic"><a href="ProductDetail-1736-2-8-29.html" target="_blank"><img src="userFiles/20100127172020.jpg" alt="" width="175" height="85" /></a></i><i class="iTitle"><a href="ProductDetail-1736-2-8-29.html" target="_blank">可爱蘑菇小灯</a></i><ul><li><a href="ProductDetail-1736-2-8-29.html" target="_blank">小小蘑菇灯，夜晚里柔柔的光线，带来了无限的温馨与浪漫…</a></li></ul></div>
     <div class="tInfo"><i class="iPic"><a href="ProductDetail-1048-2-8-29.html" target="_blank"><img src="userFiles/20100127172253.jpg" alt="" width="175" height="85" /></a></i><i class="iTitle"><a href="ProductDetail-1048-2-8-29.html" target="_blank">爱心收纳文件盒</a></i><ul><li><a href="ProductDetail-1048-2-8-29.html" target="_blank">让你桌面不再凌乱，让乏味的办公环境变得舒心</a></li></ul></div>
     <div class="tInfo"><i class="iPic"><a href="ProductDetail-903-2-8-29.html" target="_blank"><img src="userFiles/20100127172412.jpg" alt="" width="175" height="85" /></a></i><i class="iTitle"><a href="ProductDetail-903-2-8-29.html" target="_blank">小动物绕线器</a></i><ul><li><a href="ProductDetail-903-2-8-29.html" target="_blank">可爱小动物表情，凌乱的电线，绕一绕，变得整齐</a></li></ul></div>
     <div class="tInfo"><i class="iPic"><a href="Search/1-2-1/_25E9_259F_25B3_25E4_25B9_2590_25E6_2580_25AA_25E7_2589_25A9/default.htm" target="_blank"><img src="userFiles/20100127172611.jpg" alt="" width="175" height="85" /></a></i><i class="iTitle"><a href="Search/1-2-1/_25E9_259F_25B3_25E4_25B9_2590_25E6_2580_25AA_25E7_2589_25A9/default.htm" target="_blank">音乐怪物小音箱</a></i><ul><li><a href="Search/1-2-1/_25E9_259F_25B3_25E4_25B9_2590_25E6_2580_25AA_25E7_2589_25A9/default.htm" target="_blank"><p>潮爆时代谁还会在乎一个音箱到底有多响？个性才是硬…</p></a></li></ul></div>
  </div>
  </div>
</div>
</body>
</html>